*{
	margin: 0;
	padding: 0;
}

/*.wrapper{
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

.content{
	float: left;
	color: #FFFFFF;
	background-color: black;
	width: 100px;
	height: 100px;
}*/

/*===============================line1=================*/

/*.box{
	float: left;
	width: 100px;
	height: 100px;
	background-color: black;
	opacity: 0.5;
}
.demo{
	width: 150px;
	height: 150px;
	background-color: green;
}*/

/*==================================line2========================*/
/*
.wrapper{
	border: 1px solid black;
}

/*
 * float: left; 父级不能包住子集
 */
/*.content{
	float: left;
	color: #FFFFFF;
	background-color: black;
	width: 100px;
	height: 100px;
}

p{
	border-top: 0px solid green;
	clear: both;
}*/
/*=========================line4===================*/
/*span::before{
	content:"成哥";
	display: inline-block;
	width: 100px;
	height: 100px;
	background-color: red;
}
span::after{
	content: "是的";
	display: inline-block;
	width: 100px;
	height: 100px;
	background-color: red;
}*/
/*=============================line5========================================*/
/*.wrapper::after{
	display: block;
	content: "";
	clear: both;
}
.wrapper{
	border: 1px solid black;
	
}
.content{
	float: left;
	color: #FFFFFF;
	background-color: black;
	width: 100px;
	height: 100px;
	
}*/
/*==============================line6===========================*/
/*
 * position: absolute;
 * float:left/right  行级块元素
 */
/*span{
	position: absolute;
	width: 100px;
	height: 100px;
	background-color: red;
}*/
/*============================line7=========================*/
/*
 * 文字环绕 float: left
 */
/*img{
	margin-right: 5px;
	width: 100px;
	height: 100px;
}
.img1{
	float: left;
}
.img2{
	float: right;
}*/

/*====================================line8==================================*/
/*
 * 去原点 list-stype:none
 */
.nav{
	list-style: none;
	
}
a{
	text-decoration: none;
}

.nav::after{
	content: "";
	display: block;
	clear: both;
}
.nav .list-item{
	float: left;
	margin: 0 10px;
	height: 30px;
	line-height: 30px;
}
.nav .list-item a{
	padding: 0 5px;
	color: #f40;
	font-weight: bold;
	height: 30px;
	display: inline-block;
	border-radius: 15px;
	
}
.nav .list-item a:hover{
	background-color: #f40;
	color: #fff;
}
